Form State
#状態管理(GUI)
リアルタイムバリデーションや相関チェック、dirtyチェックなどが鬼門
Form Stateの一例
Reactだと
react-hook-form
https://react-hook-form.com/api/useform/formstate/
https://react-hook-form.com/api/useform/getfieldstate/
Mantine: use-form
Ant Design : Form
refine: useForm
Angularだと抽象クラスがある
https://angular.jp/api/forms/AbstractControl
Vanillaだとmayoiga
バリデーションはzodとかyupで書きたい派
/mrsekut-p/formの設計
フォーム作成プラクティス(web.dev)
ラジオボタンやセレクトボックスにおける「未選択」やnullとundefinedの区別
必須のラジオボタンでも初期表示では「未選択」状態にする必要があったりする
さらに初期表示の「未選択」状態と「選択なし」を選んだ状態もあったりする
SSoT(唯一の情報源)をどこに置くべきか?
koushisa.iconとしては
「未選択」は value === (null || undefined) ではなく !!dirtyFields.value で意味をもたせる
「選択なし」は undefined
nullはバイナリや時刻など、言語仕様上の理由やWeb APIの制約で仕方がないときのみ許容する
暗黙的な0フォールバックする場合はローカルスコープだけに留める